// 交互-链接
import React from 'react';
import FormItem from 'antd/lib/form/FormItem';
// import { filterObjectNullKeys } from 'src/libs/utils';
import { Input, notification, Radio } from 'antd';
// import { filterObjectNullKeys } from 'src/libs/utils';

interface IProps {
	config: any;
	onValuesChange: ( chartType: string, key: string, values: Object, configType: string ) => void;
	form: any;
}

const Link = ( props: IProps ) => {
	const { config, onValuesChange } = props;
	const onBlur = ( e ) => {
		if( config.mutual.jumpReport || ( config.mutual.jumpReport && config.mutual.jumpReport.length !== 0 ) ) {
			notifyErrorMsg( '文本框的跳转设置和超链接设置不能同时开启，已清除跳转设置' );
		}
		onValuesChange( config.type, config.key, { linkHref: e.target.value, jumpReport: '' }, 'mutual' );
		// console.log( form.getFieldValue( 'titleValue' ) );
	};

	const notifyErrorMsg = ( msg ) => {
		notification.error( {
			message: '',
			description: msg,
		} );
	};
	return (
		<div key="link">
			<FormItem label="链接url设置" name="linkHref">
				<Input onBlur={onBlur} onPressEnter={onBlur} placeholder="不用包含http://" />
			</FormItem>
			<FormItem label="超链接打开方式" name="openingMode">
				<Radio.Group>
					<Radio value='modal'>超链接在本页面弹框中打开</Radio>
					<Radio value='_self'>在本页面打开</Radio>
					<Radio value='_blank'>打开浏览器新页面</Radio>
				</Radio.Group>
			</FormItem>
		</div>
	);

};

export default React.memo( Link );
